<template>
  <div class="send">
    <div style="height: 98px"></div>
    <div class="loading-show" v-if="loading" v-loading="loading" :element-loading-text="loadingText"></div>
    <div class="loading-show" v-if="loadings" v-loading="loadings"></div>
    <!-- <div class="loading-show" v-if="loadingss" v-loading="loadingss"></div> -->
    <div>
      <div class="order-info">
        <div class="order-title userInfo">
          <span>货主信息</span>
          <div class="userInfo_text" v-if="flag == '0'">
            <span style="margin-right: 20px;font-size: 12px;">发布人: {{ add_admin_name }}</span>
            <span style="font-size: 12px;">发布时间: {{ add_time }}</span>
          </div>
        </div>
        <div class="business_info">
          <span style="margin-right: 15px;font-size: 12px;">发布企业:</span>
          <div class="business_boeder">
            <el-select :disabled="taskId != ''" v-model="business_value" clearable filterable @change="changesyscodes"
              placeholder="请选择企业" size="small">
              <el-option v-for="(item, index) in group_id_list" :key="index" :label="item.group_name"
                :value="item.group_id">
              </el-option>
            </el-select>
          </div>
          <span style="margin-right: 15px; margin-left: 25px; font-size: 12px;">联系人:</span>
          <div class="business_boeder">
            <el-select v-model="people_value" clearable filterable @change="changePeople" placeholder="请选择企业联系人"
              size="small">
              <el-option v-for="item in contact_list" :key="item.contact_id" :label="item.contact_name"
                :value="item.contact_id">
              </el-option>
            </el-select>
          </div>
        </div>
      </div>
      <div class="order-info">
        <div class="order-title">
          <span>提箱信息</span>
        </div>
        <div class="order-content">
          <div class="content-left">
            <div class="content-left-info">
              <img class="hint" src="@/assets/image/hint.svg" alt="">
              <span>上传托单自动识别，识别失败请手动填写</span>
            </div>
            <div class="content-left-file">
              <el-upload class="upload-demo" drag multiple action="" accept="" :before-upload="uploadBefore"
                :http-request="goRequest">
                <!-- <i class="el-icon-upload"></i> -->
                <img class="file-img" src="@/assets/image/upFile.png" alt="">
                <div class="el-upload__text file-text">将文件拖到此处，或<em>点击上传</em></div>
              </el-upload>
            </div>
          </div>
          <div class="content-right">
            <el-form :model="ruleForm" :rules="rules" ref="ruleForm" size="small" label-width="80px"
              class="demo-ruleForm">
              <el-row :gutter="24">
                <el-col :span="8">
                  <el-form-item label="港口" prop="port_id">
                    <el-select v-model="ruleForm.port_id" filterable @change="changesyscode" style="width: 100%;"
                      placeholder="请选择港口">
                      <el-option v-for="(item, index) of port" :key="index" :label="item.name"
                        :value="item.port_id"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="进出口" prop="business_type_id">
                    <el-select filterable v-model="ruleForm.business_type_id" @change="changesyscodeTwo"
                      style="width: 100%;" placeholder="请选择进出口">
                      <el-option v-for="(item) of business_type" :key="item.value" :label="item.name"
                        :value="item.value"></el-option>

                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="提单号" prop="bill_lading_number">
                    <el-input clearable v-model="ruleForm.bill_lading_number" placeholder="请输入提单号"></el-input>
                  </el-form-item>
                </el-col>

              </el-row>
              <el-row :gutter="24">

                <el-col :span="8">
                  <el-form-item label="船名航次" prop="vessel_voyage">
                    <el-input clearable v-model="ruleForm.vessel_voyage" placeholder="请输入船名航次"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="提箱场站" prop="station_id">
                    <!-- <el-input v-model="ruleForm.station_name"></el-input> -->

                    <el-select v-model="ruleForm.station_id" clearable filterable @change="changesyscodeThree"
                      style="width: 100%;" placeholder="请选择提箱场站">
                      <el-option v-for="(item, index) of station_list" :key="index" :label="item.station"
                        :value="item.station_id"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <div class="isSelects">
                    <el-button v-if="isSelect" type="primary" size="mini" @click="infoSelect">信息检索</el-button>
                    <el-button v-if="!isSelect" type="primary" size="mini" disabled icon="el-icon-loading"
                      @click="infoSelect">正在检索</el-button>
                  </div>

                </el-col>
              </el-row>
              <el-row :gutter="24">
                <el-col :span="8">
                  <el-form-item label="落箱场站">
                    <!-- <el-input v-model="ruleForm.drop_station_name"></el-input> -->
                    <el-select v-model="ruleForm.drop_station_id" @change="changesyscodeFore" style="width: 100%;"
                      clearable filterable placeholder="请选择落箱场站">
                      <el-option v-for="(item, index) of drop_station_list" :key="index" :label="item.station"
                        :value="item.station_id"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>

                <el-col :span="8">
                  <el-form-item label="联系人">
                    <el-input v-model="ruleForm.contacts" clearable placeholder="请输入联系人"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="电话">
                    <el-input v-model="ruleForm.phone" clearable placeholder="请输入电话号码"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row :gutter="24">
                <el-col :span="8">
                  <el-form-item label="截单时间">
                    <el-date-picker clearable v-model="ruleForm.cut_off_time" style="width: 100%;" type="datetime"
                      placeholder="请选择截单日期时间" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss">
                    </el-date-picker>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="截港时间">
                    <el-date-picker clearable v-model="ruleForm.cut_off_port_time" style="width: 100%;" type="datetime"
                      placeholder="请选择截港日期时间" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss">
                    </el-date-picker>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row :gutter="24">
                <el-col :span="8">
                  <!-- <el-form-item label="活动区域" prop="region"> -->
                  <el-input type="textarea" autosize placeholder="请输入备注" v-model="ruleForm.remarks">
                  </el-input>
                  <!-- </el-form-item> -->
                </el-col>
                <el-col :span="16">
                  <div class="uploadOther"
                    style="font-size: 12px;color: #606266;font-weight: 500; display: flex; align-items: center;position: relative;">
                    <span>其他附件：</span>
                    <!-- :on-change="handleChanges" -->
                    <el-upload class="upload-demo" action=""
                      accept="image/jpeg, image/png, image/gif, .pdf, .doc, .docx, .xls, .xlsx" :on-remove="removeFile"
                      :before-upload="(file) => uploadBefore(file, '2')" :http-request="goRequest"
                      :file-list="enclosure">
                      <el-button color="#165DFF" size="mini" type="primary"
                        :disabled="isUploadDisabled">点击上传</el-button>
                    </el-upload>
                  </div>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <div class="notices" style="margin-top: 16px;">
                    <div class="notice-text">上传要求</div>
                    <div class="notice-checkbox">
                      <el-checkbox-group v-model="ruleForm.need_info_id" @change="noticeChecks">
                        <el-checkbox v-for="(item, index) of box_image" :disabled="index == 0 || index == 1"
                          :key="index" :label="item.id">{{
                            item.field_name }}</el-checkbox>
                      </el-checkbox-group>
                    </div>
                  </div>
                </el-col>
              </el-row>
            </el-form>
          </div>
        </div>
      </div>
    </div>
    <div class="plant-info">
      <div class="plant-back">
      </div>
      <div class="plant-title">
        <span>工厂信息</span>
        <el-button type="primary" plain icon="el-icon-plus" @click="addPlant" size="mini">新增</el-button>
      </div>
      <!-- v-for="(item, index) in plantNum" :key="index" -->
      <div class="plant-content" v-for="(item, index) in factoryInfo" :key="index">
        <div class="plant-content-item">
          <!-- <div class="plant-item-left">
                        <div class="item-left-info">
                            <div class="height-center">
                                <img class="hint" src="@/assets/image/hint.svg" alt="">
                                <span>复制工厂信息自动识别，识别失败请手动填写</span>
                            </div>
                        </div>
                        <div class="item-left-address">
                            <el-input type="textarea" @input="debouncedOnSubmit(index)"
                                style="height: 76px !important;font-size: 12px;" class="recognition"
                                :autosize="{ minRows: 6, maxRows: 6 }" resize="none"
                                v-model="factoryInfo[index].addressRecognition"></el-input>
                        </div>
                    </div> -->
          <div class="content-rights">
            <el-form :model="factoryInfo[index]" :rules="rulesTwo" ref="factoryInfo" size="small" label-width="90px"
              class="demo-ruleForm">
              <el-row :gutter="24">
                <el-col :span="18">
                  <el-form-item label="工厂地址">
                    <el-input @input="debouncedOnSubmit(index)" placeholder="粘贴地址进行自动识别" style="font-size: 12px;"
                      v-model="factoryInfo[index].addressRecognition"></el-input>
                  </el-form-item>
                </el-col>
                <el-col class="but_color" :span="6">
                  <el-button size="mini" color="#165DFF" type="primary" @click="optionBus(index)">选择工厂</el-button>
                </el-col>
              </el-row>
              <el-row :gutter="24">
                <el-col :span="12">
                  <el-form-item label="街道地址" prop="address_code" :rules="rulesTwo.address_code">
                    <el-cascader :key="factoryInfo[index].address_code.join('-')" filterable clearable
                      v-model="factoryInfo[index].address_code" style="width: 100%;" :options="citys"
                      :ref="'areaCascader-' + index" :props="{ label: 'name', value: 'id' }"
                      @change="handleChange($event, index)" placeholder="请选择街道地址" />
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="详细地址" prop="load_and_unload_address" :rules="rulesTwo.load_and_unload_address"
                    style="position: relative;">
                    <el-input @input="setAddress(item.load_and_unload_address, item, index)" clearable
                      v-model="factoryInfo[index].load_and_unload_address" placeholder="请输入详细地址"></el-input>
                    <!-- <img class="position_img" @click="openLocation(item, index)"
                                            src="../../assets/image/send_position.png" style="width: 24px;height: 24px"
                                            alt=""> -->
                  </el-form-item>

                </el-col>
              </el-row>
              <el-row :gutter="24">
                <el-col :span="12">
                  <el-form-item label="到厂时间" prop="load_and_unload_time" :rules="rulesTwo.load_and_unload_time">
                    <el-date-picker v-model="factoryInfo[index].load_and_unload_time" style="width: 100%;"
                      type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss"
                      placeholder="请选择到厂日期时间">
                    </el-date-picker>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="电话" prop="contact_phone" :rules="rulesTwo.contact_phone">
                    <el-input clearable v-model="factoryInfo[index].contact_phone" placeholder="请输入电话号码"></el-input>
                  </el-form-item>
                </el-col>

              </el-row>
              <el-row :gutter="24">
                <el-col :span="12">
                  <el-form-item label="工厂名称">
                    <el-input clearable v-model="factoryInfo[index].name" placeholder="请输入工厂名称"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <!-- prop="contact_name" :rules="rulesTwo.contact_name" -->
                  <el-form-item label="联系人">
                    <el-input clearable v-model="factoryInfo[index].contact_name" placeholder="请输入联系人"></el-input>
                  </el-form-item>
                </el-col>

              </el-row>
              <el-row :gutter="24">
                <el-col :span="24">
                  <!-- <el-form-item label="活动区域" prop="region"> -->
                  <el-input clearable type="textarea" size="mini" autosize placeholder="请输入备注"
                    v-model="factoryInfo[index].remarks">
                  </el-input>
                  <!-- </el-form-item> -->
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <div class="notices" style="margin-top: 16px">
                    <div class="notice-text">上传要求</div>
                    <div class="notice-checkbox">
                      <el-checkbox-group v-model="factoryInfo[index].need_info_id" @change="noticeCheckss(item)">
                        <el-checkbox v-for="(item, index) of factory_image" :disabled="index == 0" :key="index"
                          :label="item.id">{{
                            item.field_name }}</el-checkbox>
                      </el-checkbox-group>
                    </div>
                  </div>
                </el-col>
              </el-row>
              <el-row>
                <el-col>
                  <div class="checkbox-top over_boxNumber" style="margin-left: 10px; margin-top: 8px">
                    <el-checkbox v-model="item.is_weighed_checkBox" label="需要过磅"></el-checkbox>
                    <el-form-item v-if="item.is_weighed_checkBox" prop="weighed_remarks" label-width="0"
                      :rules="rulesTwo.weighed_remarks" style="margin-left: 10px; width: 100%">
                      <el-input clearable size="mini" v-model="item.weighed_remarks" placeholder="请输入过磅要求"></el-input>
                    </el-form-item>
                  </div>
                </el-col>
              </el-row>
            </el-form>
          </div>
          <div class="plant-item-left">
            <!-- <location :key="`location-${index}`" style="width: 100%" :ref="'child-' + index"
                            @childData="childData" :lat="lat" :lng="lng" :position_index="index" :address="address"
                            :currentIndex="currentIndex" :isflag="lats" :isIndex='isIndex'>
                        </location> -->
            <location style="width: 100%" @childData="childData" :lat="lat" :lng="lng" :position_index="index"
              :address="address" :currentIndex="currentIndex" :isflag="lats" :isIndex='isIndex'>
            </location>
          </div>
          <img src="@/assets/image/plant-img.png" class="plant-img" alt="">
        </div>
        <div class="del-plant" @click="delPlant(index)" v-if="factoryInfo.length > 1">
          <i class="el-icon-delete"></i>
          <a style="font-size: 12px;">删除</a>
        </div>
      </div>
    </div>


    <div class="order-info box-info">
      <!-- <div class="order-title">
                <span>箱信息</span>
            </div> -->
      <div class="plant-title">
        <span>箱信息</span>
        <el-button type="primary" plain icon="el-icon-plus" @click="addBox" size="mini">新增</el-button>
      </div>
      <div class="box-content">
        <el-row :gutter="20">
          <el-col :span="24" v-for="(item, index) of box_info" :key="index">
            <div class="box-item">
              <el-form :model="box_info[index]" :rules="rulesThree" ref="formRef" size="small" label-width="90px"
                class="demo-ruleForms">
                <div class="box-back-img">
                  <div class="box-back-text">{{ index + 1 }}</div>
                </div>
                <!-- :disabled="selectedContainerIds.includes(items.id)" -->
                <div class="box-item-type">
                  <el-form-item label="柜型" prop="container_id" label-width="40px" :rules="rulesThree.container_id"
                    class="boxType">
                    <el-select v-model="item.container_id" @change="box_type(item, index)" size="mini"
                      class="type-option" placeholder="请选择柜型" filterable>
                      <el-option v-for="(items, index) in container_size" :key="index" :label="items.name"
                        :value="items.id">
                      </el-option>
                    </el-select>
                  </el-form-item>

                  <el-input-number size="mini" v-model="item.number" :min="1" :max="10"
                    @change="handleChangeNum(index, item)"></el-input-number>

                  <el-form-item style="margin-left: 20px;" label="重量" prop="weight" label-width="40px"
                    :rules="rulesThree.weight">
                    <el-input clearable class="weight-inp" size="mini" v-model="item.weight"
                      @input="getSuccessPrice(index)" placeholder="请输入单箱重量"></el-input><span
                      class="weight_text">/吨/箱</span>
                  </el-form-item>

                  <div class="checkbox-top over_boxNumber">
                    <el-checkbox v-model="item.is_appoint_checkBox" label="指定箱号"></el-checkbox>
                    <el-input clearable v-if="item.is_appoint_checkBox" size="mini" style="margin-left: 10px;"
                      class="weight-inp my-price" v-model="item.appoint_container_number"
                      placeholder="请输入指定的箱号"></el-input>
                  </div>
                  <el-checkbox-group style="margin-left: 12px;" v-model="item.checkList"
                    @change="changeBox(item, index)">
                    <div class="checkbox-top">
                      <el-checkbox :disabled="item.checkboxDisabled" label="1">必须后置</el-checkbox>
                    </div>
                  </el-checkbox-group>
                </div>
                <div class="box-item-types">
                  <el-form-item label="结算方式" prop="payment_method" label-width="70px"
                    :rules="rulesThree.payment_method">
                    <el-radio-group v-model="item.payment_method" @change="paymentMethod(item, index)">
                      <div style="display: flex;flex-direction: row;align-items: center;">
                        <el-radio :disabled="period_type == 2" label="1">平台结算</el-radio>
                        <div style="font-size: 10px;color: #999;margin-left: -20px;">
                          平台先帮您支付给司机费用</div>

                      </div>
                      <div style="margin-top: 10px; display: flex;flex-direction: row;align-items: center;">
                        <el-radio label="2">线下结算</el-radio>
                        <div style="font-size: 10px;color: #999;margin-left: -20px;">
                          您与司机自行结算，即完成运输直接支付
                        </div>
                        <el-checkbox-group style="margin-left: 12px;" v-model="item.is_dickers"
                          @change="changeBoxTwo(item, index)">
                          <el-checkbox :disabled="item.payment_method == 1" label="1">可议价</el-checkbox>
                        </el-checkbox-group>

                      </div>
                    </el-radio-group>
                  </el-form-item>
                </div>
                <div class="box-item-typess">
                  <el-form-item label="发票类型" prop="invoice_type_id" label-width="70px"
                    :rules="rulesThree.invoice_type_id">
                    <el-radio-group :class="item.invoice_type_name == '专票' ? 'radio_group' : ''"
                      v-model="item.invoice_type_id" @input='value => radioChange(value, index)'>
                      <el-radio :label="item.id" v-for="(item, index) of invoice_class" :key="index">
                        <span v-if="item.tax_ratio > 0">{{ item.type_name
                        }}{{
                            item.tax_ratio }}%</span>
                        <span v-else>{{ item.type_name
                        }}</span>
                      </el-radio>
                    </el-radio-group>
                  </el-form-item>
                </div>
                <div class="box-item-typess" v-if="item.spellShow">
                  <el-form-item v-if="item.isSpellShow" label="拼柜要求" prop="is_spell" label-width="70px"
                    :rules="rulesThree.is_spell">
                    <el-radio-group v-model="item.is_spell" @change="isspellMethod(item, index)">
                      <el-radio label="1">可以拼柜</el-radio>
                      <el-radio label="0">禁止拼柜</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <div class="recommend"
                    style="background-color: #eee;border-radius: 10px;padding-left: 10px;padding-right: 10px;">
                    <div class="recommend-text">相同货源单个柜子价格参考：</div>
                    <div style="color: rgb(134, 144, 156);font-size: 12px"><span
                        style="color: rgb(255, 125, 0); margin-left: 10px;">{{
                          item.suggest_amount }}</span>元</div>
                  </div>
                </div>
                <div class="box-item-type" v-if="item.amountShow">
                  <el-form-item v-if="item.container_type == 0 && item.is_spell == 0" label="单拖价格"
                    prop="amount_info.single_amount" label-width="70px"
                    :rules="item.is_dicker == 1 ? [] : rulesThree.single_amount">
                    <el-input maxlength="10" clearable class="weight-inp" size="mini"
                      v-model="item.amount_info.single_amount" @input="filterAmount(index, 1)"
                      placeholder="请输入单拖价格"></el-input><span class="weight_text">元</span>
                  </el-form-item>
                  <el-form-item v-if="item.container_type == 1" label="运输价格" prop="amount_info.single_amount"
                    label-width="70px" :rules="item.is_dicker == 1 ? [] : rulesThree.single_amount">
                    <el-input maxlength="10" clearable class="weight-inp" size="mini"
                      v-model="item.amount_info.single_amount" @input="filterAmount(index, 1)"
                      placeholder="请输入运输价格"></el-input><span class="weight_text">元</span>
                  </el-form-item>
                  <!-- style="margin-left: 20px;" -->
                  <el-form-item style="margin-right: 20px;"
                    v-if="item.container_type == 0 && item.is_spell == 1 && item.number % 2 !== 0 || item.is_after == 1 && item.container_type == 0 && item.is_spell == 1"
                    label="拼柜价格" prop="amount_info.lcl_amount" label-width="70px"
                    :rules="item.is_dicker == 1 ? [] : rulesThree.lcl_amount">
                    <el-input maxlength="10" clearable class="weight-inp" size="mini"
                      v-model="item.amount_info.lcl_amount" @input="filterAmount(index, 2)"
                      placeholder="请输入拼柜价格"></el-input><span class="weight_text">元</span>
                  </el-form-item>
                  <el-form-item
                    v-if="item.container_type == 0 && item.is_spell == 1 && item.number >= 2 && item.is_after != 1"
                    label="双背价格" prop="amount_info.double_amount" label-width="70px"
                    :rules="item.is_dicker == 1 ? [] : rulesThree.double_amount">
                    <el-input maxlength="10" clearable class="weight-inp" size="mini"
                      v-model="item.amount_info.double_amount" @input="filterAmount(index, 3)"
                      placeholder="请输入双背价格"></el-input><span class="weight_text">元</span>
                  </el-form-item>
                </div>
                <div class="box-item-type clear_bottom">
                  <el-form-item label="订金（司机付）" prop="deposit" label-width="100px" :rules="rulesThree.deposit">
                    <el-input maxlength="10" clearable class="weight-inp" size="mini" @input="driverDeposit(item)"
                      v-model="item.deposit" placeholder="请输入订金"></el-input><span class="weight_text">元</span>
                  </el-form-item>
                  <div class="box-footer">
                    <div style="color: rgb(255, 125, 0); padding-bottom: 3px;"><span
                        style="color: rgb(245, 63, 63);">*</span>
                      司机支付作为保证金，完成后退还司机，价格建议200-1000范围</div>
                  </div>
                </div>

                <div v-if="box_info.length > 1" class="boxInfo-del" @click="delBox(index)">
                  <i class="el-icon-delete"></i>
                </div>
              </el-form>
            </div>
          </el-col>
        </el-row>
      </div>
    </div>


    <div class="demand">

    </div>
    <div class="sendFooter">
      <div>

      </div>
      <div class="submit">
        <!-- v-if="!taskId" -->
        <el-button type="warning" @click="getSubmit(0)" class="submit-btn-two">临时保存</el-button>
        <el-button type="warning" @click="getSubmit(100)" class="submit-btn-three">指派发布</el-button>
        <el-button type="primary" @click="getSubmit(10)" class="submit-btn">抢单发布</el-button>
      </div>
      <!-- <div class="submit" v-else-if="flag == '1'">
                <el-button type="warning" @click="getSubmit(0)">保存</el-button>
            </div>
            <div class="submit" v-else>
                <el-button type="primary" @click="getSubmit()" class="submit-btn">立即下单</el-button>
            </div> -->

    </div>
    <!-- 历史地址 -->
    <el-dialog title="选择工厂" :close-on-click-modal="false" @close="handleClose" :visible.sync="dialogVisiblelocation"
      width="70%">
      <el-form :inline="true" :model="addressForm" class="demo-form-inline">
        <el-form-item label="工厂关键字">
          <el-input size="mini" v-model="addressForm.factory_keywords" placeholder="请输入工厂关键字"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" size="mini" @click="currentPage = 1; getAddressInfo(1)">搜索</el-button>
        </el-form-item>
      </el-form>
      <el-table :data="addressInfo" style="font-size: 12px;">
        <el-table-column property="name" label="工厂名称" width="200" align="center">
          <template slot-scope="scope">
            {{ scope.row.name || '--' }}
          </template>
        </el-table-column>
        <el-table-column property="load_and_unload_address" label="工厂地址" align="center">
          <template slot-scope="scope">
            {{ scope.row.load_and_unload_address || '--' }}
          </template>
        </el-table-column>
        <el-table-column property="contact_name" label="联系人" width="100" align="center">
          <template slot-scope="scope">
            {{ scope.row.contact_name || '--' }}
          </template>
        </el-table-column>
        <el-table-column property="contact_phone" label="联系电话" width="120" align="center">
          <template slot-scope="scope">
            {{ scope.row.contact_phone || '--' }}
          </template>
        </el-table-column>
        <el-table-column property="add_time" label="添加时间" width="180" align="center">
          <template slot-scope="scope">
            {{ scope.row.add_time || '--' }}
          </template>
        </el-table-column>
        <el-table-column label="操作" width="100" align="center">
          <template slot-scope="scope">
            <el-button size="mini" type="primary" @click="handleButtonClick(scope.row)">选择</el-button>
          </template>
        </el-table-column>

      </el-table>
      <div style="margin-top: 24px;">

        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
          :page-sizes="[10]" :page-size="10" layout="total, sizes, prev, pager, next, jumper" :total="pageInfo.total">
        </el-pagination>
      </div>
    </el-dialog>
    <el-dialog title="指派发布" :close-on-click-modal="false" @close="handleCloseTwo" :visible.sync="dialogVisibleassign"
      width="70%" class="custom-dialog">
      <assignSend :assign_list="assign_list" :ruleForm="ruleForm" :factoryInfo="factoryInfo"
        @parentMethods="parentMethods">
      </assignSend>
      <div slot="footer" class="dialog-footer" style="padding-bottom: 20px; margin-right: 20px;">
        <el-button @click="dialogVisibleassign = false">取 消</el-button>
        <el-button type="primary" @click="assignSubmit">指派发布</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { debounce } from '../../utils/debounce';
import { citys } from "../../../public/address.json"
import location from '../../components/location'
import assignSend from './assignSend/assignSend.vue'
import { argument, recognize, getAllAddress, getPrice, goSubmit, taskDetail, baseData, approve, orderStatus, getPathDistance, fileUpload, bussPeople, infoSelectData, period, getAddressInfo, assignOrder, assignFund } from '@/api/api'
import axios from "axios"; //引入axios
import AMapLoader from "@amap/amap-jsapi-loader";
window._AMapSecurityConfig = {
  // 安全密钥
  securityJsCode: localStorage.getItem('map_secret'),
};
export default {
  data () {
    return {
      loadingText: '',
      // 上传附件
      enclosure: [],
      // 搜索
      addressForm: {
        factory_keywords: '',
      },
      // 当前企业账期
      period_type: '',
      // 参数
      box_image: [],
      factory_image: [],
      group_id_list: [],
      contact_list: [],
      drop_station_list: [],
      station_list: [],
      business_type: [],
      container_size: [],
      invoice_class: [],
      port: [],
      task_note: [],
      detailData: {},
      citys: citys,
      loading: false,
      loadings: false,
      loadingss: false,
      dialogVisiblelocation: false,
      dialogVisibleassign: false,
      // 地址列表
      addressInfo: [],
      pageInfo: {},
      addressIndex: null,

      add_admin_id: '',
      add_admin_name: '',
      add_time: '',
      business_value: '',
      people_value: '',
      group_name: '',
      lat: 36.014076,
      lng: 120.202032,
      position_index: 0,
      address: '',
      ruleForm: {
        port_id: 1,
        port: '',
        business_type_id: 2,
        business_type: '出口',
        cut_off_time: '',
        vessel_voyage: '',
        bill_lading_number: '',
        cut_off_port_time: '',
        station_id: '',
        station_name: '',
        contacts: '',
        phone: '',
        remarks: '',
        drop_station_id: '',
        drop_station_name: '',
        is_agency: '',
        need_info_id: [1, 2]
      },
      changeInfo: [
        { img: '/weight-d', activeImg: '/weight-c', value: 1 },
        { img: '/weight-b', activeImg: '/weight-a', value: 2 }
      ],
      special_remarks: '',
      factoryInfo: [
        {
          address_code: [],
          address: '',
          load_and_unload_address: '',
          contact_name: '',
          contact_phone: '',
          load_and_unload_time: '',
          remarks: '',
          addressRecognition: '',
          need_info_id: [7],
          lat: null,
          lng: null,
          is_weighed_checkBox: false,
          // 是否需要过磅
          is_weighed: '0',
          // 过磅要求
          weighed_remarks: '',
          name: '',
        }
      ],
      coordinates: null, // 存储经纬度
      errorMessage: '', // 错误信息
      box_info: [
        {
          container_id: '',
          container_name: '',
          container_type: '',
          checkboxDisabled: true,
          number: 1,
          boxImgFlag: 1,
          currentImg: '/weight-c',
          is_same_weight: 1,
          is_appoint_checkBox: false,
          // 是否指定箱号
          is_appoint: '0',
          // 箱号内容
          appoint_container_number: '',
          // box_list: [
          //     {
          //         weight: '',
          //         suggest_amount: '',
          //         amount: '',
          //     }
          // ],
          weight: '',
          suggest_amount: '',
          // 箱复选框
          checkList: [],
          other_note: '',
          // 结算方式
          payment_method: '1',
          // 发票
          invoice_type_id: 6,
          invoice_type_name: '不开票',
          tax_ratio: '0',
          // 是否议价
          is_dickers: [],
          is_dicker: '0',
          // 是否拼柜
          is_spell: '',
          // 价格信息
          amount_info: {
            single_amount: '',
            lcl_amount: '',
            double_amount: '',
          },
          // 订金
          deposit: '',
          // 是否后置
          is_after: '',
          // 是否展示拼柜
          isSpellShow: true,
          // 是否展示拼柜这一行信息
          spellShow: false,
          // 是否展示价格信息
          amountShow: false,
        }
      ],
      radio: 3,
      num4: 1,
      invoice_type_id: '',
      invoice_type_name: '',
      tax_ratio: '',
      change: 1,
      weightInput: '',
      // 注意事项复选
      checkListTwo: [],
      value: '',
      taskId: '',
      orderStatus: '',
      flag: '',
      rules: {

        port_id: [
          { required: true, message: '请选择港口', trigger: 'change' },
        ],
        business_type_id: [
          { required: true, message: '请选择进出口', trigger: 'change' }
        ],
        cut_off_time: [
          { required: true, message: '请选择截单日期时间', trigger: 'change' }
        ],
        vessel_voyage: [
          { required: true, message: '请输入船名航次', trigger: 'blur' }
        ],
        bill_lading_number: [
          { required: true, message: '请输入提单号', trigger: 'blur' }
        ],
        cut_off_port_time: [
          { required: true, message: '请选择截港日期时间', trigger: 'change' }
        ],
        station_id: [
          { required: true, message: '请选择提箱场站', trigger: 'change' }
        ],
        drop_station_id: [
          { required: true, message: '请选择落箱场站', trigger: 'change' }
        ],
        contacts: [
          { required: true, message: '请输入联系人', trigger: 'blur' }

        ],
        phone: [
          { required: true, message: '请输入电话号码', trigger: 'blur' },
          {
            // pattern: /^1[3-9]\d{9}$|^0\d{2,3}-\d{7,8}$/, // 这里是一个简单的手机号正则 (\d{3,4}-)?[0-9]{7,8})
            pattern: /^(((\d{3,4}-)?[0-9]{7,8})|(1(3|4|5|6|7|8|9)\d{9})|((\d{3,4})?[0-9]{7,8}))$/,
            message: '请输入有效的电话号码',
            trigger: 'blur'
          }
        ],
      },
      oldValue: null,
      rulesTwo: {
        address_code: [
          { required: true, message: '请选择地址', trigger: 'change' },
        ],
        load_and_unload_address: [
          { required: true, message: '请输入详细地址', trigger: 'blur' }
        ],
        // contact_name: [
        //     { required: true, message: '请输入联系人', trigger: 'blur' }

        // ],
        contact_phone: [
          { required: true, message: '请输入电话号码', trigger: 'blur' },
          {
            // pattern: /^(((\d{3,4}-)?[0-9]{7,8})|(1(3|4|5|6|7|8|9)\d{9}))$/
            pattern: /^(((\d{3,4}-)?[0-9]{7,8})|(1(3|4|5|6|7|8|9)\d{9})|((\d{3,4})?[0-9]{7,8}))$/,
            message: '请输入有效的电话号码',
            trigger: 'blur'
          }
        ],
        load_and_unload_time: [
          { required: true, message: '请选择装卸货时间', trigger: 'change' }
        ],
        weighed_remarks: [
          { required: true, message: '请输入过磅要求', trigger: 'blur' }
        ]
      },
      rulesThree: {
        container_id: [
          { required: true, message: '请选择柜型', trigger: 'change' },
        ],
        weight: [
          { required: true, message: '请输入单箱重量', trigger: 'blur' },
        ],
        payment_method: [
          { required: true, message: '请选择结算方式', trigger: 'change' },
        ],
        invoice_type_id: [
          { required: true, message: '请选择发票类型', trigger: 'change' },
        ],
        is_spell: [
          { required: true, message: '请选择拼柜要求', trigger: 'change' },
        ],
        single_amount: [
          { required: true, message: '请输入运输价格', trigger: 'blur' },
        ],
        lcl_amount: [
          { required: true, message: '请输入拼柜价格', trigger: 'blur' },
        ],
        double_amount: [
          { required: true, message: '请输入双背价格', trigger: 'blur' },
        ],
        deposit: [
          { required: true, message: '请输入订金', trigger: 'blur' },
        ],
      },
      // 是否正在检索
      isSelect: true,
      // 过滤箱型
      selectedContainerIds: [],
      location: null,
      geocoder: null,
      watchers: new Map(), // 用于存储 watcher 的 Map

      mapLoaded: false, // 用于标记地图是否已加载
      currentIndex: 0,
      lats: null,
      isIndex: 1,
      // 分页条数
      currentPage: 1,
      // 指派数组
      assign_list: [],
      // 指派传递数据
      detailDataInfo: [],
      // 选择企业的id
      sysCode_id: '',
    };
  },
  components: {
    location,
    assignSend,
  },
  created () {
    this.getArgument()
    // this.getAllPrice()
    this.getBaseData()
    this.debouncedOnSubmit = debounce((index) => {
      this.recognition(index);
    }, 500);
  },
  mounted () {
    const testJson = require('../../../public/address.json');
    this.citys = testJson;
    if (this.$route.query.id) {
      // if (this.$route.query.status == 0) {
      //     this.orderStatus = ''
      // } else {
      //     this.orderStatus = this.$route.query.status
      // }
      this.taskId = this.$route.query.id
      // this.orderStatus = this.$route.query.status
      // this.flag = this.$route.query.flag
      this.getApplyData()
    }

  },

  methods: {
    submitForm (formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          alert('submit!');
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    // 企业结算账期
    periodInfo (group_id) {
      let formData = new FormData()
      formData.append('group_id', group_id)
      period(formData).then(res => {
        if (res.status == 200) {
          this.period_type = res.data.payment_method
          if (this.period_type == '2') {
            this.box_info.forEach(item => {
              item.payment_method = '2'
            });
          } else {
            this.box_info.forEach(item => {
              item.payment_method = '1'
            });
          }
        }
      })
    },
    resetForm (formName) {
      this.$refs[formName].resetFields();
    },
    // 传递index
    transmit (index) {

    },
    // 获取审核数据
    getApplyData () {
      this.loadings = true
      const formData = new FormData()
      formData.append('type', this.orderStatus)
      formData.append('id', this.taskId)
      taskDetail(formData).then(res => {
        console.log('任务详情', res);
        if (res.status == 200) {

          this.detailData = res.data
          if (this.detailData.enclosure) {
            this.enclosure = JSON.parse(this.detailData.enclosure)
          }
          for (const key in this.detailData) {
            // 检查本地对象是否有相同的属性
            if (this.ruleForm.hasOwnProperty(key)) {
              // 赋值
              this.ruleForm[key] = this.detailData[key];
            }
          }
          // 处理数据
          this.ruleForm.need_info_id = this.ruleForm.need_info_id.split(',').map(Number);
          // 判断时间是否准确  == '0000-00-00 00:00:00'
          if (!this.ruleForm.cut_off_port_time) {
            this.ruleForm.cut_off_port_time = ''
          }
          // 判断落箱是否准确
          if (this.ruleForm.drop_station_id == 0) {
            this.ruleForm.drop_station_id = ''
          }

          if (this.detailData.factory_info.length > 0) {
            this.detailData.factory_info.forEach(item => {
              item.address_code = item.address_code.split(',').map(Number)
              item.need_info_id = item.need_info_id.split(',').map(Number);
              if (item.is_weighed == 1) {
                this.$set(item, 'is_weighed_checkBox', true);
              } else {
                this.$set(item, 'is_weighed_checkBox', false);
              }
            })
            this.factoryInfo = this.detailData.factory_info

            this.factoryInfo.forEach((item, index) => {
              item.addressRecognition = item.load_and_unload_address
              // 调用识别
              this.recognition(index)
            })
          }

          if (this.detailData.box_info.length > 0) {
            this.detailData.box_info.forEach(item => {

              if (item.is_appoint == 1) {
                this.$set(item, 'is_appoint_checkBox', true);
              } else {
                this.$set(item, 'is_appoint_checkBox', false);
              }
              // if (item.container_type == 1) {
              //     // item.checkboxDisabled = true
              //     this.$set(item, 'checkboxDisabled', true);
              //     // console.log('我是禁用>>>>>>>>>>>>>>');

              // } else {
              //     this.$set(item, 'checkboxDisabled', false);
              // }

              // this.selectedContainerIds.push(item.container_id)

              if (item.is_after == 1) {
                this.$set(item, 'checkList', ['1']);
              } else {
                this.$set(item, 'checkList', []);
              }
              if (item.is_dicker == 1) {
                this.$set(item, 'is_dickers', ['1']);
              } else {
                this.$set(item, 'is_dickers', []);
              }
              if (item.payment_method == 1) {
                item.payment_method = '1'
              } else {
                item.payment_method = '2'
              }
              if (item.is_spell == 1) {
                item.is_spell = '1'
              } else {
                item.is_spell = '0'
              }
              item.spellShow = true
              item.amountShow = true
              if (item.container_type == 1) {
                item.isSpellShow = false
                item.checkboxDisabled = true
              } else {
                item.isSpellShow = true
                item.checkboxDisabled = false
              }
            });


            this.box_info = this.detailData.box_info
            this.$set(this.box_info, 'box_info', this.detailData.box_info);
            console.log('箱信息', this.box_info);
            // console.log('箱信息', this.box_info);
          }

          this.add_admin_id = this.detailData.add_admin_id
          this.add_time = this.detailData.add_time
          // + '_' + this.detailData.group_type
          this.business_value = this.detailData.group_id
          // this.periodInfo(business_value)
          // 调用接口获取联系人
          this.changesyscodes(this.business_value)
          this.people_value = this.detailData.contact_id
          this.add_admin_name = this.detailData.add_admin_name
          this.group_name = this.detailData.group_name
          this.loadings = false
        } else {
          this.loadings = false
        }
      }).catch(err => {
        this.loadings = false
      })
    },

    // 指派传参
    parentMethods (data) {
      console.log('我是指派信息', data);

      this.detailDataInfo = data
    },
    changeWeight (item, imgObj, index) {
      console.log(index);

      // this.box_info[index].is_same_weight = value
      item.boxImgFlag = imgObj.value
      item.currentImg = imgObj.activeImg
      if (item.boxImgFlag == 1) {
        item.is_same_weight = 1
      } else {
        item.is_same_weight = 0
      }


    },
    infoSelect () {
      if (this.ruleForm.station_id && this.ruleForm.bill_lading_number) {
        this.isSelect = false
        const formData = new FormData()
        formData.append('bill_lading_number', this.ruleForm.bill_lading_number)
        formData.append('station_id', this.ruleForm.station_id)
        infoSelectData(formData).then(res => {
          // console.log('我是检索的信息', res);
          if (res.status == 200) {
            this.$message({
              message: '信息检索成功！',
              type: 'success'
            });
            for (const key in res.data) {
              // 检查本地对象是否有相同的属性
              if (this.ruleForm.hasOwnProperty(key) && res.data[key]) {
                if (key == 'drop_station_id') {
                  this.ruleForm[key] = Number(res.data[key])
                  this.changesyscodeFore(this.ruleForm[key])
                  this.$refs.ruleForm.clearValidate('drop_station_id');
                } else {
                  // 赋值
                  this.ruleForm[key] = res.data[key];
                  this.$refs.ruleForm.clearValidate(key);
                }

              }
            }
            this.isSelect = true
            // console.log(this.ruleForm, '111111111111');
          } else {
            this.isSelect = true
          }
        }).catch(err => {
          this.isSelect = true
        })
      } else {
        this.$alert('信息检索提箱场站和提单号不能为空！', '提示', {
          confirmButtonText: '确定',
        });
      }
    },
    // 表格行高
    tableRowClassName () {
      return 'custom-row'; // 返回自定义行类名
    },
    // 删除文件
    removeFile (file) {
      this.enclosure.forEach((item, index) => {
        if (file.name == item.name) {
          this.enclosure.splice(index, 1)
        }
      })

    },
    // 文件上传
    uploadBefore (file, type) {
      let formData = new FormData();
      formData.append("file", file);
      fileUpload(formData).then(res => {
        console.log(res, '我是路径')
        if (res.status == 200) {
          let path = res.data.href
          console.log(path, '我是path');
          if (type == 2) {
            this.enclosure.push({
              name: res.data.name,
              url: path
            })
          } else {
            // 调用文件识别接口
            this.getRecognize(path)
          }

        }
      }).catch(err => {
        console.log('图片上传失败')
      })
    },

    // 选择地址
    optionBus (index) {
      this.addressIndex = index
      this.getAddressInfo()
      this.dialogVisiblelocation = true
    },
    getAddressInfo (val) {
      this.currentPage = val
      let value = this.addressForm.factory_keywords
      // 调用接口
      const formData = new FormData()
      formData.append('factory_keywords', value)
      formData.append('page', val)
      formData.append('limit', '10')
      getAddressInfo(formData).then(res => {
        if (res.status == 200) {
          this.addressInfo = res.data.data
          this.pageInfo = res.data.page
          // this.total = 
        }
      })
    },
    // 选择
    handleButtonClick (row) {
      this.factoryInfo[this.addressIndex].addressRecognition = row.load_and_unload_address
      this.factoryInfo[this.addressIndex].load_and_unload_address = row.load_and_unload_address
      this.factoryInfo[this.addressIndex].contact_name = row.contact_name
      this.factoryInfo[this.addressIndex].contact_phone = row.contact_phone
      this.factoryInfo[this.addressIndex].name = row.name
      this.recognition(this.addressIndex)
      this.dialogVisiblelocation = false
    },
    handleSizeChange (val) {
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange (val) {
      console.log(`当前页: ${val}`);
      this.getAddressInfo(val)

    },
    // 关闭清空搜索
    handleClose () {
      this.addressForm.factory_keywords = ''
    },
    // 关闭方法
    handleCloseTwo () {
      // this.addressForm.factory_keywords = ''
    },
    // 关闭地图dialog
    handleDialogClose () {
      // 关闭对话框时调用子组件的方法
      this.$refs.child.childMethod();
    },
    getGeocode (item, index) {
      // 使用 AMapLoader 加载地图和插件
      AMapLoader.load({
        key: localStorage.getItem('map_key'),
        version: "2.0",
        plugins: ["AMap.Geocoder"],
      })
        .then((AMap) => {
          console.log('AMap loaded successfully'); // 确认 AMap 加载成功
          this.initGeocoder(item, AMap, index); // 初始化 Geocoder
        })
        .catch(error => {
          console.error('地图脚本加载失败:', error);
          alert('地图服务加载失败，请稍后再试');
        });
    },

    initGeocoder (item, AMap, index) {
      // 使用 AMap 的异步加载方式
      AMap.plugin('AMap.Geocoder', () => {
        this.geocoder = new AMap.Geocoder({
          city: "全国", // 城市设为全国
          radius: 1000 // 范围默认1000米
        });
        console.log('Geocoder initialized:', this.geocoder);
        this.performGeocode(item, index); // 初始化后执行地理编码
      });
    },

    performGeocode (items, index) {
      const item = { load_and_unload_address: items.load_and_unload_address }; // 替换为实际地址
      if (this.geocoder) {
        this.geocoder.getLocation(item.load_and_unload_address, (status, result) => {
          if (status === 'complete' && result.info === 'OK') {
            this.location = result.geocodes[0].location;
            console.log('location', this.location);
            items.lat = this.location.lat;
            items.lng = this.location.lng;
            this.openLocation(items, index)
          } else {
            alert('获取位置失败，请检查地址是否正确');
          }
        });
      } else {
        console.error('Geocoder is not initialized');
      }
    },
    // 地图
    openLocation (item, index) {
      this.isIndex = this.isIndex + 1
      this.currentIndex = index
      this.lat = item.lat
      this.lng = item.lng
      this.lats = JSON.parse(JSON.stringify(this.location.lat))
      this.address = item.load_and_unload_address ? item.load_and_unload_address : '青岛市'
    },
    // 关闭地图dialog
    closeMap () {
      // this.$refs.child.destroyMap()
      this.dialogVisiblelocation = false
    },
    // 地图传递参数
    childData (data) {
      // console.log('我是子参数', data);
      if (data.address != '') {
        this.$set(this.factoryInfo[data.position_index], 'addressRecognition', '');
        this.$set(this.factoryInfo[data.position_index], 'load_and_unload_address', data.address);
        this.recognition(data.position_index)
        // this.address = data.address
        // this.lat = data.lat
        // this.lng = data.lng

      }
      this.factoryInfo[data.position_index].lat = data.lat
      this.factoryInfo[data.position_index].lng = data.lng
    },

    // 结算方式
    paymentMethod (item, index) {
      // 清空校验
      this.$refs.formRef[index].clearValidate();
      // console.log(this.box_info);
      if (item.payment_method == 1) {
        item.is_dickers = []
        item.is_dicker = '0'
      }

    },
    // 是否拼柜
    isspellMethod (item, index) {
      // 切换时将价格清空
      item.amount_info = {
        single_amount: '',
        lcl_amount: '',
        double_amount: '',
      }
      // 清空校验
      this.$refs.formRef[index].clearValidate();
    },
    // 获取基本参数
    getArgument () {
      if (!this.taskId) {
        this.loadings = true
      }
      argument().then(res => {
        console.log(res, '基本参数');
        if (res.status == 200) {
          this.business_type = res.data.business_type
          this.container_size = res.data.container_size
          this.invoice_class = res.data.invoice_class
          this.port = res.data.port
          this.task_note = res.data.task_note
          this.drop_station_list = res.data.drop_station_list
          this.station_list = res.data.station_list
          this.box_image = res.data.box_image
          this.factory_image = res.data.factory_image
          this.port.forEach(item => {
            if (item.port_id == 1) {
              this.ruleForm.port = item.name
            }
          });
          if (!this.taskId) {
            this.loadings = false
          }
        } else {
          if (!this.taskId) {
            this.loadings = false
          }
        }
      }).catch(err => {
        if (!this.taskId) {
          this.loadings = false
        }
      })
    },
    // 企业参数
    getBaseData () {
      baseData().then(res => {
        console.log('基础参数', res);

        if (res.status == 200) {
          this.group_id_list = res.data.group_id_list
          // console.log(this.group_id_list, '11111');
        }
      })
    },
    // 地址修改获取价格
    setAddress (value, item, index) {
      if (value) {
        this.getGeocode(item, index)
        this.box_info.forEach((item, index) => {
          this.getAllPrice(index)
        })
      }
    },
    // 单选
    radioChange (sysCode, index) {
      this.invoice_class.some(item => {
        if (item.id == sysCode) {
          this.box_info[index].invoice_type_name = item.type_name
          this.box_info[index].tax_ratio = item.tax_ratio
          return true
        }

        return false
      })
      // console.log(this.box_info[index], '1111111111111111111');
      this.getAllPrice(index);
      // this.box_info.forEach((item, index) => {
      //     if (item.is_same_weight == 1) {
      //         // 如果 is_same_weight 为 1，只执行一次
      //         this.getAllPrice(index); // 这里假设你只需要传递第一个子索引
      //     } else {
      //         // 如果 is_same_weight 不为 1，执行多次
      //         item.box_list.forEach((items, indexs) => {
      //             this.getAllPrice(index, indexs);
      //         });
      //     }
      // })

    },
    // 过滤输入的方法
    filterWeightInput (inputValue) {
      // 如果第一位是小数点，移除小数点
      if (inputValue.startsWith('.') || inputValue.startsWith('0')) {
        return inputValue.slice(1); // 移除小数点
      }

      // 使用正则表达式过滤非数字字符
      let numericValue = inputValue.replace(/[^0-9.]/g, '');
      // 允许一个小数点
      const parts = numericValue.split('.');
      if (parts.length > 2) {
        // 如果有多个小数点，只保留第一个
        numericValue = parts[0] + '.' + parts.slice(1).join('').replace(/\./g, '');
      }

      return numericValue;
    },
    // 过滤推荐价格
    filterAmount (index, indexs) {
      // 定义一个数组来映射 indexs 到相应的属性名
      const amountKeys = ['single_amount', 'lcl_amount', 'double_amount'];

      // 获取当前输入值
      const inputValue = this.box_info[index].amount_info[amountKeys[indexs - 1]];

      let roundedValue = inputValue.replace(/[^0-9]/g, '');

      // 处理赋值逻辑
      if (roundedValue === 0 || isNaN(roundedValue)) {
        this.box_info[index].amount_info[amountKeys[indexs - 1]] = '';
      } else {
        this.box_info[index].amount_info[amountKeys[indexs - 1]] = roundedValue;
      }
    },
    // 输入重量后获取价格
    getSuccessPrice (index, indexs) {
      // 获取当前输入的值
      const inputValue = this.box_info[index].weight;

      // 过滤输入值
      const filteredValue = this.filterWeightInput(inputValue);

      // 更新输入值
      this.box_info[index].weight = filteredValue;

      // 如果过滤后的值不为空，调用获取价格的方法
      if (filteredValue) {
        this.getAllPrice(index, indexs);
      }
    },
    // 获取价格
    getAllPrice (index, indexs) {
      const formData = new FormData()
      formData.append('address', this.factoryInfo[0].load_and_unload_address)
      formData.append('weight', this.box_info[index].weight)
      formData.append('container_type', this.box_info[index].container_name)
      formData.append('tax_ratio', this.box_info[index].tax_ratio)
      formData.append('type', 'task')
      getPrice(formData).then(res => {
        // console.log(res, '我是价格');
        if (res.status == 200) {
          this.box_info[index].suggest_amount = res.data.suggest_amount
        }

      })
    },
    // 司机订金
    driverDeposit (item) {
      // 使用正则表达式过滤非数字字符
      let numericValue = item.deposit.replace(/[^0-9]/g, '');

      // 检查第一个字符是否为 '0'，并且长度大于 1
      // if (numericValue.length == 1 && numericValue.startsWith('0')) {
      //     // 如果是，则去掉第一个字符
      //     numericValue = numericValue.substring(1);
      // }

      // 更新 item.deposit
      item.deposit = numericValue;
    },
    // 文件识别
    getRecognize (path) {
      console.log('>>>>>>>>>>>>>>>>>');
      let formData = new FormData();
      formData.append("file", path);
      recognize(formData).then(res => {
        console.log(res, '识别上传成功');

      })
    },
    // 
    goRequest () {
      // console.log('>>>>>>>>>>>>>>>');

    },
    // 新增工厂信息
    addPlant () {
      if (this.factoryInfo.length < 3) {
        this.factoryInfo.push({
          address: '',
          address_code: [],
          load_and_unload_address: '',
          contact_name: '',
          contact_phone: '',
          load_and_unload_time: '',
          remarks: '',
          addressRecognition: '',
          need_info_id: [7],
          lat: null,
          lng: null,
          is_weighed_checkBox: false,
          // 是否需要过磅
          is_weighed: '0',
          // 过磅要求
          weighed_remarks: '',
          name: '',
        })
      } else {
        this.$alert('工厂信息最多3个！', '提示', {
          confirmButtonText: '确定',
        });
      }


    },
    // 删除
    delPlant (index) {
      let length = this.factoryInfo.length
      this.factoryInfo.splice(index, 1)

      this.factoryInfo.forEach((item, index) => {
        item.addressRecognition = item.load_and_unload_address
        // 调用识别
        this.recognition(index)
      })

    },
    // 计数器
    handleChangeNum (index, item) {
      item.amount_info = {
        single_amount: '',
        lcl_amount: '',
        double_amount: '',
      }
      this.$refs.formRef[index].clearValidate();
      // const currentCount = this.box_info[index].box_list.length; // 当前已有的条目数
      // const newCount = this.box_info[index].number; // 用户输入的新条目数

      // if (newCount > currentCount) {
      //     for (let i = currentCount; i < newCount; i++) {
      //         this.box_info[index].box_list.push({
      //             weight: '',
      //             suggest_amount: '',
      //             amount: '',
      //         })
      //         // this.box_info[index].box_list[0].suggest_amount
      //     }
      // } else {
      //     for (let i = currentCount; i > newCount; i--) {
      //         this.box_info[index].box_list.pop()
      //     }
      // }
      // this.getAllPrice(index)

    },
    // 柜型
    box_type (item, index) {
      // 清空校验
      this.$refs.formRef[index].clearValidate();
      this.container_size.some(items => {
        if (items.id === item.container_id) {
          item.container_name = items.name
          item.container_type = items.type
          item.type_name = items.type_name
          // this.selectedContainerIds[index] = item.container_id // 存储已选择的柜型 ID
          this.$set(this.selectedContainerIds, index, item.container_id);
          // console.log('我是存储类型的数组', this.selectedContainerIds);

          return true
        }
        // if (items.disabled == true) {
        //     items.disabled = false
        // } else {

        // }
        return false
      })
      item.amountShow = true
      item.spellShow = true
      item.amount_info = {
        single_amount: '',
        lcl_amount: '',
        double_amount: '',
      }
      if (item.container_type == 1) {
        this.box_info[index].checkList = []
        this.changeBox(item, index)
        item.isSpellShow = false
        item.is_spell = '0'

      } else {
        item.isSpellShow = true
        item.is_spell = '1'
      }
      // item.disabled = true
      // console.log('柜型', item.type_name);
      if (item.type_name === '小柜') {
        item.checkboxDisabled = false
      } else {
        item.checkboxDisabled = true
      }
      if (this.box_info[index].is_same_weight == 1) {
        // 如果 is_same_weight 为 1，只执行一次
        this.getAllPrice(index, 0); // 这里假设你只需要传递第一个子索引
      } else {
        // 如果 is_same_weight 不为 1，执行多次
        this.box_info[index].box_list.forEach((items, indexs) => {
          this.getAllPrice(index, indexs);
        });
      }
    },
    // 删除箱信息
    delBox (index) {
      this.box_info.splice(index, 1)
      this.selectedContainerIds.splice(index, 1)
    },
    // 四级联动地址
    handleChange (event, index) {
      this.$nextTick(() => {
        const cascaderRef = this.$refs['areaCascader-' + index][0];
        if (cascaderRef && cascaderRef.getCheckedNodes().length > 0) {
          const checkedNodes = cascaderRef.getCheckedNodes();
          let address = checkedNodes[0].pathLabels.join(' ');
          this.factoryInfo[index].address = address;
          console.log(this.factoryInfo[index].address, '地址添加成功');
        } else {
          console.warn('没有选中的节点，无法获取地址');
          this.factoryInfo[index].address = ''; // 或者设置为其他默认值
        }
      });

    },
    // 地址识别
    recognition (index) {
      if (this.factoryInfo[index].addressRecognition) {
        console.log('我被调用', this.factoryInfo[index].addressRecognition);

        const formData = new FormData()
        formData.append('address', this.factoryInfo[index].addressRecognition)
        getAllAddress(formData).then(res => {
          // console.log(res, '我是识别的信息');
          if (res.status == 200) {
            if (res.data.address.province) {
              const newAddressCode = res.data.address.street_id == '' ?
                [res.data.address.province_id, res.data.address.city_id, res.data.address.area_id] :
                [res.data.address.province_id, res.data.address.city_id, res.data.address.area_id, res.data.address.street_id];

              this.$set(this.factoryInfo[index], 'address_code', newAddressCode);
              this.$set(this.factoryInfo[index], 'load_and_unload_address', res.data.detail);


              // 手动触发 input 事件
              this.$nextTick(() => {
                this.setAddress(this.factoryInfo[index].load_and_unload_address, this.factoryInfo[index], index)
              });
              this.$refs.factoryInfo[index].clearValidate(['address_code', 'load_and_unload_address']);


            } else {
              // this.$message.error('您输入的地址不正确，请重新输入');
            }
            if (res.data.name) {
              this.$set(this.factoryInfo[index], 'contact_name', res.data.name);
              this.$refs.factoryInfo[index].clearValidate(['contact_name']);
            }
            if (res.data.mobile) {
              this.$set(this.factoryInfo[index], 'contact_phone', res.data.mobile);
              this.$refs.factoryInfo[index].clearValidate(['contact_phone']);
              // 手动触发验证
              this.$nextTick(() => {
                this.$refs.factoryInfo[index].validateField('contact_phone');
              });
            }
          }
        })
      } else if (this.factoryInfo[index].load_and_unload_address) {
        const formData = new FormData()
        formData.append('address', this.factoryInfo[index].load_and_unload_address)
        getAllAddress(formData).then(res => {
          // console.log(res, '我是识别的信息');
          if (res.status == 200) {
            if (res.data.address.province) {
              const newAddressCode = res.data.address.street_id == '' ?
                [res.data.address.province_id, res.data.address.city_id, res.data.address.area_id] :
                [res.data.address.province_id, res.data.address.city_id, res.data.address.area_id, res.data.address.street_id];

              this.$set(this.factoryInfo[index], 'address_code', newAddressCode);
              this.$set(this.factoryInfo[index], 'load_and_unload_address', res.data.detail);


              // 手动触发 input 事件
              // this.$nextTick(() => {
              //     this.setAddress(this.factoryInfo[index].load_and_unload_address, this.factoryInfo[index], index)
              // });
              this.$refs.factoryInfo[index].clearValidate(['address_code', 'load_and_unload_address']);


            } else {
              // this.$message.error('您输入的地址不正确，请重新输入');
            }

          }
        })
      }
    },

    // 复选框
    changeBox (item, index) {
      // 清空校验
      this.$refs.formRef[index].clearValidate();
      let checkboxList = ''
      checkboxList = item.checkList.join(',')
      if (checkboxList == '1') {
        item.is_after = checkboxList
      } else {
        item.is_after = '0'
      }
    },
    // 是否可以议价
    changeBoxTwo (item, index) {
      let checkboxList = item.is_dickers.join(',');
      if (checkboxList === '1') {
        item.is_dicker = checkboxList;
        this.$refs.formRef[index].clearValidate();
        // this.$nextTick(() => {
        //     if (this.$refs['formRef' + index]) {
        //         this.$refs['formRef' + index].resetFields();
        //     }
        // });
        // console.log('清空校验', index);
      } else {
        item.is_dicker = '0';
      }
    },
    // 新增箱地址
    addBox () {
      let type = String(this.period_type)
      // console.log(type, '111111');

      this.box_info.push({

        container_id: '',
        container_name: '',
        container_type: '',
        number: '',
        checkboxDisabled: true,
        boxImgFlag: 1,
        currentImg: '/weight-c',
        is_same_weight: 1,
        is_appoint_checkBox: false,
        // 是否指定箱号
        is_appoint: '0',
        // 箱号内容
        appoint_container_number: '',
        // box_list: [
        //     {
        //         weight: '',
        //         suggest_amount: '',
        //         amount: '',
        //     }
        // ],
        weight: '',
        suggest_amount: '',
        other_note: '',
        // 箱复选框
        checkList: [],
        // 结算方式
        payment_method: type || '1',
        // 发票
        invoice_type_id: 6,
        invoice_type_name: '不开票',
        tax_ratio: '0',
        // 是否议价
        is_dickers: [],
        is_dicker: '',
        // 是否拼柜
        is_spell: '',
        // 价格信息
        amount_info: {
          single_amount: '',
          lcl_amount: '',
          double_amount: '',
        },
        // 订金
        deposit: '',
        // 是否后置
        is_after: '',
        // 是否展示拼柜
        isSpellShow: true,
        // 是否展示拼柜这一行信息
        spellShow: false,
        // 是否展示价格信息
        amountShow: false,

      })

    },
    // 注意复选框
    noticeCheck () {
      // console.log(this.checkListTwo, '我是注意的复选框');
    },
    // 提箱复选框
    noticeChecks () {
      // console.log(this.ruleForm.need_info_id, '我是提箱的复选框');
    },
    // 工厂复选框
    noticeCheckss (item) {
      // console.log(item.need_info_id, '我是工厂的复选框');
    },
    // 获取企业信息
    changesyscodes (sysCode) {
      this.periodInfo(sysCode);
      this.sysCode_id = sysCode;
      this.people_value = '';
      // 企业联系人接口
      if (sysCode) {
        const formData = new FormData()
        formData.append('group_id', sysCode);
        bussPeople(formData).then(res => {
          // console.log('我是企业联系人', res)
          if (res.status == 200) {
            this.contact_list = res.data.contact_list;
          }
        })
      }
      this.group_id_list.some(item => {
        if (item.group_id === sysCode) {
          this.group_name = item.group_name;
          return true;
        }
        return false;
      })
    },
    changePeople (value) {
      // console.log('我是联系人id', value);

    },
    // 获取港口name
    changesyscode (sysCode) {
      this.port.some(item => {
        if (item.port_id === sysCode) {
          this.ruleForm.port = item.name;
          return true;
        }
        return false;
      })
    },
    // 获取进口出口
    changesyscodeTwo (sysCode) {
      this.business_type.some(item => {
        if (item.value == sysCode) {
          this.ruleForm.business_type = item.name;
          // console.log(this.ruleForm.business_type);
          return true;
        }

        return false;
      })
    },
    // 获取提箱
    changesyscodeThree (sysCode) {
      this.station_list.some(item => {
        if (item.station_id == sysCode) {
          this.ruleForm.station_name = item.station;
          // console.log(this.ruleForm.station_name);
          return true;
        }

        return false;
      })
    },
    // 获取落箱
    changesyscodeFore (sysCode) {
      this.drop_station_list.some(item => {
        if (item.station_id == sysCode) {
          this.ruleForm.drop_station_name = item.station;
          // console.log(this.ruleForm.drop_station_name);
          return true;
        }
        return false;
      })
    },
    // 指派发布
    designate () {

    },

    // 提交
    getSubmit (flag) {

      let firstForm = false
      let doubleForm = 0
      let threeForm = 0
      if (!this.business_value) {
        this.$alert('请选择发布企业', '提示', {
          confirmButtonText: '确定',
        });
        return
      }
      if (!this.people_value) {
        this.$alert('请选择企业联系人', '提示', {
          confirmButtonText: '确定',
        });
        return
      }
      this.$refs['ruleForm'].validate((valid) => {
        if (valid) {
          firstForm = true
        } else {
          // 获取表单的错误信息
          const errors = this.$refs.ruleForm.fields.filter(field => field.validateMessage);
          if (errors.length > 0) {
            // 根据错误信息弹出提示
            const firstError = errors[0].validateMessage;
            this.$alert(firstError, '提示', {
              confirmButtonText: '确定',
            });
            // return false
          }
        }
      })
      if (firstForm) {
        this.$refs.factoryInfo.forEach((item) => {
          item.validate((vali) => {
            if (!vali) {
              // 检查每个表单项的错误信息
              const errors = item.fields.filter(field => field.validateMessage);
              if (errors.length > 0) {
                this.$alert(errors[0].validateMessage, '提示', {
                  confirmButtonText: '确定',
                });
              }
            } else {
              doubleForm++;
            }
          })
        })
      }

      if (firstForm && doubleForm == this.factoryInfo.length) {
        for (let item of this.box_info) {
          if (item.is_appoint_checkBox) {
            if (item.appoint_container_number) {
              item.is_appoint = '1'
            } else {
              this.$alert('请输入指定箱号', '提示', {
                confirmButtonText: '确定',
              });
              return false
            }

          } else {
            item.is_appoint = ''
            item.appoint_container_number = ''
          }
        }
        this.$refs.formRef.forEach((item) => {
          item.validate((vali) => {
            if (!vali) {
              // 检查每个表单项的错误信息
              const errors = item.fields.filter(field => field.validateMessage);
              if (errors.length > 0) {
                // 根据第一个错误信息弹窗提示
                // this.$message.error();
                this.$alert(errors[0].validateMessage, '提示', {
                  confirmButtonText: '确定',
                });
              }
            } else {
              threeForm++;
            }
          })
        })
      }

      if (firstForm && doubleForm == this.factoryInfo.length && threeForm == this.box_info.length) {

        if (flag == 100) {
          let is_assignss = false
          for (let i = 0; i < this.box_info.length; i++) {
            if (this.box_info[i].payment_method == 1) {
              is_assignss = true
            }

          }
          if (is_assignss) {
            // 处理数据
            this.factoryInfo.forEach(item => {
              if (item.need_info_id && Array.isArray(item.need_info_id)) {
                item.need_info_id = item.need_info_id.join(',')
              }
              if (item.is_weighed_checkBox) {
                item.is_weighed = '1'
              } else {
                item.is_weighed = '0'
                item.weighed_remarks = ''
              }
            })
            const formData = new FormData();
            for (let item in this.ruleForm) {
              if (item == 'need_info_id') {
                // this.ruleForm[item] = this.ruleForm[item].join(',')
                const id_list = this.ruleForm[item].join(',');
                formData.append('need_info_id', id_list);
              } else {
                formData.append(item, this.ruleForm[item]);
              }

            }
            formData.append('factory_info', JSON.stringify(this.factoryInfo));
            formData.append('box_info', JSON.stringify(this.box_info));
            formData.append('enclosure', JSON.stringify(this.enclosure));
            formData.append('group_id', this.business_value);
            formData.append('contact_id', this.people_value);
            formData.append('group_name', this.group_name);

            // 调用接口
            assignOrder(formData).then(res => {
              if (res.status == 200) {
                this.assign_list = res.data.assign_list
                this.factoryInfo.forEach(item => {
                  if (item.need_info_id) {
                    item.need_info_id = item.need_info_id.split(',').map(Number)
                  }
                  if (item.is_weighed_checkBox) {
                    item.is_weighed = '1'
                  } else {
                    item.is_weighed = '0'
                    item.weighed_remarks = ''
                  }
                })
              }
            })
            this.dialogVisibleassign = true
          } else {
            this.$confirm(`线下结算暂不支持指派发布！`, '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
            })
          }

        } else {
          let title = ''
          if (flag == 10) {
            title = '确定发布货物信息?'
            this.loadingText = '正在发布任务'
          } else if (flag == 0) {
            title = '确认临时保存货物信息?'
            this.loadingText = '正在保存'
          }
          this.$confirm(`${title}`, '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
          }).then(() => {
            this.loading = true
            //TODO
            // 处理数据
            this.factoryInfo.forEach(item => {
              if (item.need_info_id && Array.isArray(item.need_info_id)) {
                item.need_info_id = item.need_info_id.join(',')
              }
              if (item.is_weighed_checkBox) {
                item.is_weighed = '1'
              } else {
                item.is_weighed = '0'
                item.weighed_remarks = ''
              }
            })
            const formData = new FormData()
            for (let item in this.ruleForm) {
              if (item == 'need_info_id') {
                // this.ruleForm[item] = this.ruleForm[item].join(',')
                const id_list = this.ruleForm[item].join(',');
                formData.append('need_info_id', id_list);
              } else {
                formData.append(item, this.ruleForm[item]);
              }
            }
            formData.append('factory_info', JSON.stringify(this.factoryInfo));
            formData.append('box_info', JSON.stringify(this.box_info));
            formData.append('enclosure', JSON.stringify(this.enclosure));
            formData.append('group_id', this.business_value);
            formData.append('contact_id', this.people_value);
            formData.append('group_name', this.group_name);
            formData.append('is_assign', '0');
            if (flag == 0) {
              formData.append('status', '0');
              formData.append('id', this.taskId);
            } else {
              formData.append('status', '10');
              formData.append('id', this.taskId);
            }
            approve(formData).then(res => {
              console.log(res);
              if (res.status == 200) {
                setTimeout(() => {
                  this.loading = false
                  this.$alert(res.msg, '提示', {
                    confirmButtonText: '确定',
                    callback: action => {
                      // this.flag = ''
                      this.$router.replace({
                        path: this.$route.path, // 保持当前路径
                        query: {} // 清空查询参数
                      });
                      // 使用 setTimeout 确保参数清空后再跳转
                      setTimeout(() => {
                        this.$router.push({
                          path: '/orderPage',
                        });
                      }, 0); // 0 毫秒延迟
                    }
                  });
                }, 3500);
              } else {
                this.loading = false
              }

            }).catch(err => {
              this.loading = false
              console.log('我是错误', err);

            })
          }).catch(() => {

          });
        }


      }
    },

    // 指派提交
    assignSubmit () {
      let isPhone = false
      this.detailDataInfo.forEach(item => {
        if (item.phone) {
          isPhone = true
        }
      })

      if (isPhone) {
        const formDatas = new FormData()
        formDatas.append('assign_list', JSON.stringify(this.detailDataInfo));
        // 验证资金池
        assignFund(formDatas).then(res => {
          if (res.status == 200) {
            this.soreSubmit()
          }
        })

      } else {
        this.$alert('请添加接单人！', '提示', {
          confirmButtonText: '确定',
        });
      }

    },
    // 指派确定提交
    soreSubmit () {
      this.dialogVisibleassign = false
      this.loadingText = '正在指派任务'
      this.loading = true
      // 处理数据
      this.factoryInfo.forEach(item => {
        if (item.need_info_id && Array.isArray(item.need_info_id)) {
          item.need_info_id = item.need_info_id.join(',')
        }
        if (item.is_weighed_checkBox) {
          item.is_weighed = '1';
        } else {
          item.is_weighed = '0';
          item.weighed_remarks = '';
        }
      })

      const formData = new FormData()
      for (let item in this.ruleForm) {
        if (item == 'need_info_id') {
          // this.ruleForm[item] = this.ruleForm[item].join(',')
          const id_list = this.ruleForm[item].join(',');
          formData.append('need_info_id', id_list);
        } else {
          formData.append(item, this.ruleForm[item]);
        }
      }
      formData.append('factory_info', JSON.stringify(this.factoryInfo));
      formData.append('box_info', JSON.stringify(this.box_info));
      formData.append('enclosure', JSON.stringify(this.enclosure));
      formData.append('assign_list', JSON.stringify(this.detailDataInfo));
      formData.append('group_id', this.business_value);
      formData.append('contact_id', this.people_value);
      formData.append('group_name', this.group_name);
      formData.append('status', '10');
      formData.append('is_assign', '1');
      formData.append('id', this.taskId);

      approve(formData).then(res => {
        console.log(res);
        if (res.status == 200) {
          setTimeout(() => {

            this.loading = false
            this.$alert(res.msg, '提示', {
              confirmButtonText: '确定',
              callback: action => {
                // this.flag = ''
                this.$router.replace({
                  path: this.$route.path, // 保持当前路径
                  query: {} // 清空查询参数
                });
                // 使用 setTimeout 确保参数清空后再跳转
                setTimeout(() => {
                  this.$router.push({
                    path: '/orderPage',
                  });
                }, 0); // 0 毫秒延迟
              }
            });
          }, 3500);
        } else {
          this.loading = false
        }

      }).catch(err => {
        this.loading = false
        console.log('我是错误', err);

      })
    }
  },
  watch: {
    // factoryInfo: {
    //     handler (newItems) {
    //         newItems.forEach((item, index) => {
    //             // 监听每个对象的 dynamicProperty 属性
    //             this.$watch(
    //                 () => item.address_code,
    //                 (newValue, oldValue) => {
    //                     this.handleChange(newValue, index)
    //                     // console.log('我是监测事件');
    //                 }
    //             );

    //         });
    //     },
    //     deep: true, // 深度监听
    //     // immediate: true, // 立即执行一次
    // },

    factoryInfo: {
      handler (newItems) {
        // 清理不再需要的 watcher
        this.watchers.forEach((unwatch, key) => {
          if (!newItems.includes(key)) {
            unwatch(); // 移除 watcher
            this.watchers.delete(key);
          }
        });

        newItems.forEach((item, index) => {
          if (!this.watchers.has(item)) {
            // 仅为尚未被监视的 item 创建 watcher
            const unwatch = this.$watch(
              () => item.address_code,
              (newValue, oldValue) => {
                this.handleChange(newValue, index);
              }
            );
            this.watchers.set(item, unwatch); // 存储新的 watcher
          }
        });
      },
      deep: true,
    },

  },
  computed: {
    isUploadDisabled () {
      return this.enclosure.length > 2;
    },
  },

}
</script>

<style scoped lang="scss">
::v-deep .el-checkbox__label {
  font-size: 12px;
}

::v-deep .el-radio__label {
  font-size: 12px;
}

::v-deep .el-form-item--small .el-form-item__content {
  line-height: 30px;
}

.send {
  background-color: rgb(242, 243, 245);
  padding: 16px;
}

.order-info {
  background-color: #fff;
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 16px;
}

.order-title {
  font-size: 14px;
  font-weight: 500;
  font-family: PingFang SC;
  color: rgb(29, 33, 41);
}

.userInfo {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.business_info {
  display: flex;
  align-items: center;
}

.business_info {
  font-size: 14px;
  color: #4e5969;
  margin-top: 10px;
}

::v-deep .business_boeder .el-input__inner {
  // border: 0px;
  border: 1px solid #DCDFE6;
  border-radius: 6px;
}

.userInfo_text {
  font-size: 14px;
  color: #666;
}

.order-content {
  margin-top: 16px;
  display: flex;
}

.content-left {
  width: 268px;
  height: auto;
}

.content-left-info {
  width: 268px;
  height: 30px;
  padding: 0 19px 0 31px;
  line-height: 30px;
  border-radius: 6px;
  box-sizing: border-box;
  background-color: rgb(237, 248, 255);
  border: 1px solid rgb(205, 225, 255);
  font-size: 12px;
  color: rgb(29, 33, 41);
  font-family: PingFang SC;
  font-weight: 400;
  position: relative;
  margin-bottom: 8px;
}

.hint {
  position: absolute;
  left: 10px;
  top: 7px;
}

.content-right {
  margin-left: 24px;
  flex: 1;
  position: relative;
  z-index: 11;
}

.content-rights {
  // margin-left: 24px;
  flex: 1;
  position: relative;
  z-index: 11;
}

::v-deep .el-upload-dragger {
  width: 268px !important;
  height: 212px !important;
  border: 1px dashed rgb(138, 174, 255);
  border-radius: 6px;
  text-align: center;
}

.file-img {
  width: 56px;
  height: 48px;
  margin-top: 48px;
}

.file-text {
  margin-top: 16px;
  font-size: 12px;
  color: rgb(134, 144, 156);
  font-family: PingFang SC;
}

::v-deep .demo-ruleForm .el-form-item {
  margin-bottom: 16px !important;
  border: 1px solid #DCDFE6;
  border-radius: 6px;
  // height: 32px;
  box-sizing: border-box;
  z-index: 11;
  background-color: #fff;
}

::v-deep .demo-ruleForm .el-input__inner {
  border: 0px;
  border-radius: 6px;
}

::v-deep .el-input--small .el-input__inner {
  width: 100% !important;
  height: 30px;
  line-height: 30px;
  font-size: 12px;
  vertical-align: top;
}

/* 工厂信息 */
.plant-info {
  background-color: #fff;
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 16px;
  position: relative;
  /* z-index: -1; */
}

.plant-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  font-weight: 500;
  font-family: PingFang SC;
  position: relative;
  z-index: 1;
}

.plant-back {
  position: absolute;
  height: 110px;
  width: 100%;
  background: url(../../assets/image/plant-back.png) no-repeat;
  background-size: 100% 100%;
  top: 0;
  left: 0;
  z-index: 0;
}

.plant-content {
  display: flex;
  align-items: center;
  z-index: 1;

}

.plant-content-item {
  width: 100%;
  /* height: 162px; */
  border-radius: 6px;
  background: linear-gradient(rgb(237, 242, 254), rgb(249, 252, 255));
  margin-top: 16px;
  padding: 16px;
  display: flex;
  position: relative;
  z-index: 10;
}

.del-plant {
  width: 7%;
  text-align: center;
  margin: 10px 0 0 10px;
  font-size: 14px;
  color: rgb(245, 63, 63);
  font-weight: 400;
}

.plant-item-left {
  margin-left: 24px;
  flex: 1;
  // width: 50%;
  position: relative;
  z-index: 11;
}

.item-left-info {
  width: 252px;
  height: 46px;
  /* line-height: 46px; */
  padding: 0 12px 0 32px;
  border-radius: 6px;
  box-sizing: border-box;
  background-color: rgb(237, 248, 255);
  border: 1px solid rgb(205, 225, 255);
  font-size: 12px;
  color: rgb(29, 33, 41);
  font-family: PingFang SC;
  font-weight: 400;
  position: relative;
  margin-bottom: 8px;
}

.height-center {
  margin-top: 7.5px;
}

.item-left-address {
  width: 252px;
  height: 145px;
  border-radius: 6px;
  background-color: #fff;
  border: 1px dashed rgb(138, 174, 255);
}

::v-deep .demo-ruleForm .el-form-item__label {
  background-color: #fff;
  // height: 30px;
  line-height: 28px;
  border-radius: 6px;
  text-align: left;
  padding-left: 12px;
  padding-right: 0px !important;
  font-size: 12px;
  color: rgb(78, 89, 105);
  font-weight: 400;
  // color: rgb(78, 89, 105);
}

.plant-img {
  width: 112px;
  height: 94px;
  position: absolute;
  top: 8px;
  right: 48px;
}

// 发票信息
.invoice-content {
  margin-top: 16px;
  display: flex;
  height: 32px;
  line-height: 32px;
  align-items: center;
}

.invoice-type {
  color: rgb(29, 33, 41);
  font-size: 12px;
  margin-right: 15px;
}

// 箱信息

.box-content {
  margin-top: 16px;
}

.box-item {
  // height: 322px;
  padding: 16px;
  box-sizing: border-box;
  background: linear-gradient(rgb(243, 248, 255), rgb(255, 255, 255));
  border: 1px solid rgb(229, 230, 235);
  border-radius: 6px;
  margin-bottom: 16px;
  position: relative;
}

// .box-back-img {
//     width: 100%;
//     height: 217px;
//     background: url(../../assets/image/box-right.png);
//     background-size: cover;
//     position: absolute;
//     top: 0;
//     right: 0;
// }

.box-question {
  width: 17px;
  height: 25px;
  background: url(../../assets/image/box-add.png);
  background-size: cover;
  position: absolute;
  top: 17px;
  right: 27px;
  z-index: 10;
}

.box-back-text {
  font-size: 44px;
  line-height: 56px;
  color: rgb(22, 93, 255, 0.12);
  background-size: cover;
  position: absolute;
  top: 0px;
  right: 26px;
  z-index: 10;
}

.box-item-type {
  display: flex;
  font-size: 12px;
  font-weight: 400;
  height: 32px;
  line-height: 28px;
  margin-bottom: 12px;
  position: relative;
  z-index: 11;
}

.box-item-types {
  display: flex;
  font-size: 12px;
  font-weight: 400;
  height: 38px;
  margin-top: 20px;
  margin-bottom: 12px;
  position: relative;
  z-index: 11;
}

.box-item-typess {
  display: flex;
  font-size: 12px;
  font-weight: 400;
  height: 28px;
  margin-top: 20px;
  line-height: 28px;
  margin-bottom: 20px;
  position: relative;
  z-index: 11;
}

.type-text {
  font-size: 12px;
  width: 60px;
  color: rgb(78, 89, 105);
}

.type-option {
  // border: 1px solid #DCDFE6;
  border-radius: 6px;
  width: 124px !important;
  height: 32px;
  margin-right: 12px;
}

::v-deep .el-input--medium .el-input__inner {
  height: 30px;
}

.box-weight {
  display: flex;
  height: 32px;
  line-height: 32px;
  align-items: center;
  margin-bottom: 16px;
  position: relative;
}

.weight-img {
  line-height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  text-align: center;
  box-sizing: border-box;
  background-color: rgb(242, 243, 245);
  margin-right: 12px;
  border-radius: 6px;
}

.weight-inp {
  // border: 1px solid #DCDFE6;
  width: 124px;
  height: 32px;
  border-radius: 6px;
  margin-left: 50px;
}

.weight-inp_two {
  border: 1px solid #DCDFE6;
  width: 131px;
  height: 32px;
  border-radius: 6px;
  margin-left: 50px;
}

.box-price {
  height: 88px;
  background-color: #fff;
  padding: 12px;
  font-size: 14px;
  font-weight: 400;
  color: rgb(78, 89, 105);
  margin-bottom: 12px;
}

.recommend {
  display: flex;
  align-items: center;
  margin-left: 20px;
  margin-bottom: 1px;
}

.recommend-text {
  font-size: 13px;
  color: #4e5969;
  font-weight: 400;
  // width: 40%;
}

.my-price {
  flex: 1;
  width: 100%;
  margin: 0;
}

.checkbox-top {
  line-height: 32px;
}

.box-footer {
  font-size: 12px;
  // margin-top: 8px;
}

.add-box-item {
  text-align: center;
}

.box-car {
  width: 130px;
  height: 130px;
  margin-top: 52px;
}

.add-box-info {
  margin-top: 20px;
}

.demand {
  position: relative;
  border-radius: 8px;
  // padding: 16px;
  margin-bottom: 72px;
  background: linear-gradient(to right, rgba(255, 255, 255), rgb(255, 255, 255), rgb(255, 248, 239));
}

.demand-img {
  width: 102px;
  height: 36px;
  position: absolute;
  top: 0;
  left: 0;
}

.notice {
  display: flex;
  height: 32px;
  align-items: center;
  margin-top: 38px;
  margin-bottom: 20px;
}

.notice-text {
  font-size: 12px;
  color: rgb(78, 89, 105);
  font-weight: 400;
  width: 60px;
  margin-right: 12px;
  text-align: right;
}

.notice-remark {
  display: flex;
}

.remark-input {
  flex: 1;
}

.remark-text {
  line-height: 30px;
}

.sendFooter {
  background-color: #fff;
  padding: 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  font-weight: 400;
  color: rgb(78, 89, 105);
  position: fixed;
  bottom: 0;
  width: calc(100% - 200px);
  // width: 100%;
  margin-left: -16px;
  z-index: 100;
  box-shadow: 0 -4px 12px 0 rgba(0, 0, 0, 0.04);
}

.clause-text {
  color: rgb(22, 93, 255);
  cursor: pointer;
}

.submit-btn {
  background-color: rgb(22, 93, 255);
  width: 176px;
  height: 40px;
}

.submit-btn:hover {
  background-color: rgb(59, 115, 244);
}

.changeWeight {
  background-color: #fff;
  border: 1px solid rgb(229, 230, 235);
  width: 32px;
  height: 32px;
}

// 像信息表格
.weight-other {
  height: 100px;
  background-color: #fff;
  padding: 4px;
  font-size: 14px;
  font-weight: 400;
  color: rgb(78, 89, 105);
  margin-bottom: 16px;
}

.custom-row {
  height: 32px;
}

.box-checkbox-b {
  // height: 32px;
  line-height: 28px;
}

.recognition {
  border: 0px !important;
}

.loading-show {
  position: absolute;
  top: 98px;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 999;
}

.boxInfo-del {
  width: 24px;
  height: 24px;
  background-color: rgb(242, 243, 245);
  border-radius: 12px 0px 5px 0px;
  position: absolute;
  bottom: 0;
  right: 0;
  line-height: 24px;
  text-align: center;
  color: rgb(245, 63, 63);
  cursor: pointer;
}

.location_icon {
  width: 265px;
  height: 35px;
  position: absolute;
  margin-top: -2px;
  margin-left: 24px;
  background-color: #fff;
  top: 1px;
  font-size: 14px;
  border: 1px solid #DCDFE6;
  border-radius: 6px;
  box-sizing: border-box;
  color: #4e5969;
  padding: 0 10px;
  // vertical-align: middle;
}

.position_number {
  vertical-align: middle;
  font-size: 12px;
  color: #f00;

}

.position_img {
  vertical-align: middle;
}

.notices {
  display: flex;
  // height: 32px;
  align-items: center;
}

::v-deep .radio_group .el-radio__input.is-checked+.el-radio__label {
  color: #dd1a20 !important;
}

::v-deep .radio_group .el-radio__input.is-checked .el-radio__inner {
  background: #dd1a20 !important;
  border-color: #dd1a20 !important;
}

.over_boxNumber {
  display: flex;
  margin-left: 12px;
}

::v-deep .el-dialog {
  margin-top: 3vh !important;
}

// dialog样式
::v-deep .el-dialog__footer {
  padding: 0px;
  padding-top: 0px;
}

::v-deep .demo-ruleForms .el-form-item__error {
  top: 82% !important;
}

::v-deep .demo-ruleForms .boxType .el-form-item__error {
  top: 98% !important;
}

::v-deep .demo-ruleForms .el-form-item__label {
  // height: 30px;
  line-height: 28px;
  border-radius: 4px;
  text-align: left;
  padding-left: 0px;
  padding-right: 0px !important;
  font-size: 12px;
  color: rgb(78, 89, 105);
  font-weight: 400;
  background-color: rgba(0, 0, 0, 0);
  // color: rgb(78, 89, 105);
}

::v-deep .demo-ruleForms .el-form-item {
  background-color: rgba(0, 0, 0, 0);
  border: none;
  /* 50% 透明度 */
}

::v-deep .demo-ruleForms .boxType .el-input__inner {
  // border: 0px;
  width: 124px !important;
}

.weight_text {
  margin-left: 8px;
  margin-right: 8px;
  font-size: 12px;
  color: #4e5969;
  font-weight: 400;
}

.demo-ruleForms .weight-inp {
  margin-left: 0px;
  width: 132px;
}

.box-back-img {
  width: 440px;
  height: 217px;
  background: url(../../assets/image/box-right.png);
  background-size: cover;
  position: absolute;
  top: 0;
  right: 0;
}

::v-deep .but_color .el-button--primary {
  background-color: #165dff;
  border-color: #165dff;
}

::v-deep .upload-demo .el-button--primary {
  background-color: #165dff;
  border-color: #165dff;
}

::v-deep .isSelects .el-button--primary {
  background-color: #165dff;
  border-color: #165dff;
}

::v-deep .uploadOther .el-upload-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  align-items: center;
  position: absolute;
  top: -4px;
  left: 145px;
  // height: 28px;
}

::v-deep .uploadOther .el-upload-list__item {
  margin-top: 6px;
}

::v-deep .uploadOther .el-upload-list__item-status-label {
  top: 2px;
}

.submit-btn-two {
  background-color: #ffba00;
  width: 176px;
  height: 40px;
}

.submit-btn-three {
  background-color: #F56C6C;
  width: 176px;
  height: 40px;
}

::v-deep .v-modal {
  z-index: 1999 !important;
}

.custom-dialog {

  /* 强制穿透 scoped 样式 */
  ::v-deep .el-dialog__body {
    min-height: 400px !important;
    overflow: auto;
    /* 允许内容溢出滚动 */
  }
}

::v-deep .el-message-box__wrapper {
  z-index: 2041 !important;
}
</style>
